<!DOCTYPE html>
<html>
<head>
	<title></title>
	<style type="text/css">
		svg{border: 1px solid #333;}
	</style>
</head>
<body>
	<svg width="600" height="400">

		<!-- <circle cx="300" cy="200" r="100" fill="blue"></circle>	 -->

		<!-- <g transform="translate(300,200)">
			<circle cx="0" cy="0" r="100" fill="blue"></circle>
		</g> -->

		<!-- g:分组  移动坐标系；属性继承 -->
		<g transform="translate(300,200)" fill="blue" stroke="red">
			<circle cx="0" cy="0" r="100"></circle>
			<rect x="100" y="100" width="100" height="100"></rect>
		</g>


	</svg>

</body>
</html>